<html>
	<head>
		<script type="text/javascript" src="jquery/jquery.js"></script>
		<script type="text/javascript" src="js/jquery-ui-1.7.3.custom.min.js"></script>
		<link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.7.3.custom.css" media="screen" />
		<script type="text/javascript">
			$(document).ready(function() {
				var availableDiv = 0;
			
				var newArray = new Array();
				
				for (var i = 0 ; i < 10 ; i++) {
					newArray[i] = {
						nama : "Jordan",
						username : "fernandoj",
						total : 100
					};
				}
				
				for (var i = 0 ; i < 10 ; i++) {
					alert(newArray[i].nama + " " + newArray[i].username + " " + newArray[i].total);
				}
			
				function buttonAction() {
					$(".another-class").css("border" , "3px solid #F50505");
					//alert($("#input-form").val());
					availableDiv++;
					$(".another-class").append('<div id="new-id-'+availableDiv+'" class="new-class" style="height: 50px; margin: 10px; border: 1px solid blue;">New Class #'+availableDiv+'</div>');
					//alert("buttonAction");
					
					return false;
				}
				
				(function() {
					alert("Fungsi A");
				});
				
				var anotherFunction = function(a,b,c) {
					alert("Arguments : " + arguments[0] + " " + arguments[1] + " " + arguments[2]);
					alert("Parameters : " + a + " " + b + " " + c);
					//alert("anotherFunction");
				};
				
				//anotherFunction("Sharon" , "Rosyid" , "Denis");
			
				$("#button").click(buttonAction);
				
				$("#button2").click(function() {
					$("#new-id-" + availableDiv).remove();
					availableDiv--;
					return false;
				});
				
				
				$("#tabbed-menu").tabs();
			})
		</script>
	</head>
	<body>
		<div id="tabbed-menu">
			<ul>
				<li><a href="#a">A</a></li>
				<li><a href="#b">B</a></li>
				<li><a href="#c">C</a></li>
				<li><a href="#d">D</a></li>
			</ul>
			<div>
				<div id="a">
					a
				</div>
				<div id="b">
					b
				</div>
				<div id="c">
					c
				</div>
				<div id="d">
					d
				</div>
			</div>
		</div>
	
		<table>
			<thead>
				<tr>
					<th></th>
				</tr>
			</thead>
			<tbody>
				<tr></tr>
			</tbody>
		</table>
	
		<input type="text" id="input-form" value="" />
	
		<div class="div-class another-class" id="div1">
			This is another class
		</div>
		
		<div class="div-class" id="div2">
			This is ordinary div-class
		</div>
		
		<a href="http://www.facebook.com" id="button">Click</a>
		
		<a href="http://www.facebook.com" id="button2">Click to Remove</a>
	</body>
</html>